<f:view xmlns="http://www.w3.org/1999/xhtml"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:p="http://primefaces.org/ui"
	xmlns:pm="http://primefaces.org/mobile" contentType="text/html">
	<f:metadata>
		<f:event listener="#{pageBean.check}" type="preRenderView"></f:event>
	</f:metadata>
	<pm:page title="Grocery Lists">
		<h:form id="groceryLists">
			<pm:view id="main">
				<pm:header
					title="Welcome #{groceryListsBean.session.currentUser.email}">
					<f:facet name="left">
						<h:commandButton value="Logout" id="logout_btn" action="logout" />
					</f:facet>
					<f:facet name="right">
						<h:commandButton value="Add List" id="create"
							action="#{groceryListsBean.addGroceryList}" />
					</f:facet>
				</pm:header>
				<pm:content>
					<h:outputText rendered="#{groceryListsBean.groceryListEmpty}">
						<h3>Users Grocery List</h3>
					</h:outputText>
					<h:outputText rendered="#{!groceryListsBean.groceryListEmpty}">
						<h3>This is empty</h3>
					</h:outputText>


					<p:dataList id="userGroceryLists" var="glist"
						value="#{groceryListsBean.usersLists}">

						<div style="float: left; width: 5%;">
							<p:graphicImage library="images" name="check_24x20.png"
								rendered="#{glist.status == 'FINISHED'}" />
						</div>
						<div style="float: left; width: 65%">

							<h3>
								<h:outputLabel value="#{glist.name}" rendered="#{empty glist.shoppingItems}"/>
								<h:commandLink action="shoppingview" value="#{glist.name}" rendered="#{not empty glist.shoppingItems}">
									<f:param name="groceryList" value="#{glist.groceryListId}" />
								</h:commandLink>
							</h3>

							<p>
								<h:outputText value="#{glist.shoppingDate}">
									<f:convertDateTime type="date" pattern="MM/dd/yyyy"
										style="text-align: left;" />
								</h:outputText>
							</p>

						</div>



						<div>

							<pm:buttonGroup orientation="horizontal">

								<!-- template grocery list -->
								<p:commandLink action="#{groceryListsBean.templateGroceryList}">
									<f:param name="groceryList" value="#{glist.groceryListId}" />
									<f:param name="template" value="yes" />
									<p:graphicImage library="images" name="new_window_32x32.png" />
								</p:commandLink>

								<!-- edit grocery list -->
								<p:commandLink action="#{groceryListsBean.editGroceryList}">
									<f:param name="groceryList" value="#{glist.groceryListId}" />
									<p:graphicImage library="images"
										name="pen_alt_stroke_32x32.png" />
								</p:commandLink>

								<!-- delete grocery list -->
								<p:commandLink action="#{groceryListsBean.deleteGroceryList}">
									<f:param name="deleteGroceryList" value="#{glist.groceryListId}" />
									<p:graphicImage library="images" name="x_alt_32x32.png" />

								</p:commandLink>

							</pm:buttonGroup>

						</div>




					</p:dataList>
				</pm:content>
				<pm:footer fixed="true">
					<center>
						Delete account? Please be aware that this cannot be undone! <br />
						<h:commandButton id="deleteButton" value="Delete Account!"
							action="#{groceryListsBean.deleteUser}" />

					</center>
				</pm:footer>
			</pm:view>
		</h:form>
	</pm:page>

</f:view>
